<template>
  <div>
     <!-- 面包屑导航 -->
   <el-breadcrumb separator="/">
      <el-breadcrumb-item :to="{ path: '/home' }">
        <i class="el-icon-s-home"></i>
        首页
      </el-breadcrumb-item>
      <el-breadcrumb-item :to="{ path: '/active/seconds' }">
        <i class="el-icon-s-shop"></i> 
        活动管理
      </el-breadcrumb-item>
      <!-- 当前 -->
      <el-breadcrumb-item>拼团管理</el-breadcrumb-item>
      <!-- 当前 -->
      <el-breadcrumb-item>{{ breadcrumb }}</el-breadcrumb-item>
    </el-breadcrumb>

    <div class="msj_pintuan">
      <!-- 导航栏 -->
      <Huodongnav :navlist="navlist" @onbreadcrumb="breadcrumbfn" />
      <div class="msj_spell">
        <Spellpindetail v-show="isshow==0" />
        <Spellshops v-show="isshow==1" />
        <Secondfenlei :text="text" v-show="isshow==2" />
        <Spellswiper v-show="isshow==3" />
        <Spellstate v-show="isshow==4" />
      </div>
    </div>
   
  </div>
</template>
<script>
import Huodongnav from './components/Huodongnav.vue';
import Secondfenlei from './Seconds/Secondfenlei.vue';
import Spellpindetail from './Spell/Spellpindetail.vue';
import Spellshops from './Spell/Spellshops.vue';
import Spellstate from './Spell/Spellstate.vue';
import Spellswiper from './Spell/Spellswiper.vue';

export default{
    data() {
        return {
            breadcrumb: '拼团概述',
            text:'添加新拼团商品分类',
            navlist: [
                {
                    name: '拼团概述'
                },
                {
                    name: '商品管理'
                },
                {
                    name: '分类管理'
                },
                {
                    name: '轮播管理'
                },
                {
                    name: '状态管理'
                }
            ],
            isshow:0,
        };
    },
    mounted(){
    this.isshow=this.$route.params.curr?this.$route.params.curr:this.isshow
    this.$bus.$emit('getcurr',{curr:this.isshow})
  },
    methods: {
      breadcrumbfn(v){
        this.breadcrumb = v.name
      this.isshow = v.curr
      }
    },
    components: { Huodongnav, Spellpindetail, Spellshops, Secondfenlei, Spellswiper, Spellstate }
}
</script>
<style scoped>
*{
  margin: 0;
}
  .msj_spell,.msj_pintuan{
    width: 100%;
    padding: 15px 0 0;
  }
</style>